<template>
  <div id="manager-pos">
    <el-container style="height: 100vh">
      <!-- 头部信息 -->
      <el-header>
        <el-row>
          <el-col :span="2"
            ><div class="grid-content bg-purple">聘途</div></el-col
          >
          <el-col :span="2" :offset="20"
            ><div class="grid-content bg-purple">
              <el-button
                style="font-size: large; color: black"
                type="text"
                @click="Loginout"
                >退出登录</el-button
              >
            </div></el-col
          >
        </el-row>
      </el-header>
      <el-container>
        <!-- 左侧栏 -->
        <el-aside width="200px">
          <Sidebar></Sidebar>
        </el-aside>
        <!-- 主体 -->
        <el-main>
          <el-table :data="tableData" height="900" style="width: 100%">
            <!-- 使用 v-for 遍历列配置数组 -->
            <el-table-column
              v-for="column in tableColumns"
              :key="column.prop"
              :prop="column.prop"
              :label="column.label"
              :width="column.width"
            >
            </el-table-column>
            <el-table-column label="岗位描述">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="primary"
                  plain
                  @click="LookPositionCv(scope.$index, scope.row)"
                  >查看</el-button
                >
              </template>
            </el-table-column>
            <el-table-column label="公司介绍">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="primary"
                  plain
                  @click="LookCompanyCv(scope.$index, scope.row)"
                  >查看</el-button
                >
              </template>
            </el-table-column>
            <el-table-column label="操作">
              <template slot-scope="scope">
                <el-button
                  size="mini"
                  type="danger"
                  @click="handleDelete(scope.$index, scope.row)"
                  >删除</el-button
                >
              </template>
            </el-table-column>
          </el-table>
          <!-- 弹窗公司 -->
          <el-dialog title="公司介绍" :visible.sync="dialogTableVisiblecom">
            <pre style="font-size: x-large">{{ companycv }}</pre>
          </el-dialog>
          <!-- 弹窗岗位 -->
          <el-dialog title="岗位描述" :visible.sync="dialogTableVisiblepos">
            <pre style="font-size: x-large">{{ positioncv }}</pre>
          </el-dialog>
        </el-main>
      </el-container>
    </el-container>
  </div>
</template>
    
    <script>
import axios from "axios";
import Sidebar from "@/components/ManagerSidebar.vue";
export default {
  components: {
    Sidebar,
  },
  data() {
    return {
      companycv: "",
      positioncv: "",
      dialogTableVisiblecom: false,
      dialogTableVisiblepos: false,
      tableData: [],
      tableColumns: [
        { prop: "pid", label: "ID", width: "80" },
        { prop: "cname", label: "公司名", width: "120" },
        { prop: "pname", label: "岗位名称", width: "120" },
        { prop: "salary", label: "薪资", width: "120" },
        { prop: "paddress", label: "地址", width: "120" },
        // { prop: "pinfo", label: "岗位描述", width: "120" },
        // { prop: "cinfo", label: "公司简介", width: "120" },
        { prop: "cphone", label: "公司电话", width: "120" },
        { prop: "cemail", label: "公司邮箱", width: "120" },
        { prop: "hot", label: "热度", width: "120" },
        { prop: "enumber", label: "招聘人数", width: "120" },
        { prop: "anumber", label: "已录用", width: "120" },
        // 可以根据需要定义更多列配置
      ],
    };
  },
  created() {
    this.getPositionList();
  },
  methods: {
    LookPositionCv(index, row) {
      this.dialogTableVisiblepos = true;
      let data = new FormData();
      data.append("pinfo", row.pinfo);
      axios
        .post(
          "http://localhost:8080/hqdx/company/showPositionDescription",
          data
        )
        .then((response) => {
          this.positioncv = response.data.data.items;
        })
        .catch((error) => {
          console.log(error);
        });
    },
    LookCompanyCv(index, row) {
      this.dialogTableVisiblecom = true;
      let data = new FormData();
      data.append("cinfo", row.cinfo);
      axios
        .post("http://localhost:8080/hqdx/company/showCompanyProfile", data)
        .then((response) => {
          this.companycv = response.data.data.items;
        })
        .catch((error) => {
          console.log(error);
        });
    },
    getPositionList() {
      axios
        .get("http://localhost:8080/hqdx/manager/showPosition")
        .then((response) => {
          this.tableData = response.data.data.items;
        })
        .catch((error) => {
          console.log(error);
        });
    },
    handleDelete(index, row) {
      this.deletePosition(row.pid);
    },
    deletePosition(pid) {
      const confirmDelete = confirm("确定要删除这个岗位吗?");
      if (confirmDelete) {
        let data = new FormData();
        data.append("pid", pid);
        axios
          .post("http://localhost:8080/hqdx/manager/deletePosition", data)
          .then((response) => {
            this.getPositionList();
            console.log("公司已删除");
          })
          .catch((error) => {
            console.log("删除失败:", error);
          });
      }
    },
    Loginout() {
      this.$router.push('/manage-login');
      sessionStorage.setItem("LoginManaState", JSON.stringify(false)); //退出登录，状态记录
    },
  },
};
</script>
    
  
  <style scoped>
.el-header {
  background-color: #b3c0d1;
  color: #333;
  text-align: center;
  line-height: 60px;
}

.el-aside {
  background-color: #d3dce6;
  color: #333;
  text-align: center;
  line-height: 200px;
}

.el-main {
  background-color: #e9eef3;
  color: #333;
  text-align: center;
}

body > .el-container {
  margin-bottom: 40px;
}
</style>
    